<template>
  <div class="projectAdd" v-loading="detailInfoShow">
    <!-- 筛选按钮 -->
    <div class="search-button" v-if="!contactAddShow && !saleAddShow">
      <el-button
          class="btn search"
          @click="followadd"
          v-if="projectForm.practiceStatus == 0"
      >
        <el-icon class="icon" color="#fff">
          <DocumentChecked/>
        </el-icon
        >
        启动
      </el-button
      >
      <el-button
        class="btn add"
        @click="handlerschedule"
        v-if="projectForm.practiceStatus == 1 || projectForm.practiceStatus == 2 "
        ><el-icon class="icon" color="#fff"> <DocumentDelete /> </el-icon
        >分配</el-button
      >
      <!-- [0].includes(projectForm.projectStatus)&& -->
      <el-button
        v-if="projectForm.practiceStatus == 2"
        class="btn save"
        @click="handleStatusBtn(7, '完成')"
        ><el-icon class="icon" color="#fff"> <DocumentDelete /> </el-icon
        >完结</el-button
      >

      <el-button
          class="btn add"
          @click="handlerPolling"
          v-if="['fourth'].includes(activeName1)"
      >
        <el-icon class="icon" color="#fff">
          <DocumentDelete/>
        </el-icon
        >
        巡检
      </el-button
      >

      <el-button class="btn direction" @click="handleBack"
      >
        <el-icon class="icon" color="#fff">
          <Back/>
        </el-icon>
        返回
      </el-button
      >
    </div>
    <div class="content">
      <div class="content-top">
        <div class="content-title">{{ projectForm.projectName }}</div>
        <div class="content-tab">
          <div class="item-tab" v-if="projectForm.businessScheduleName">
            {{ projectForm.businessScheduleName }}
          </div>
          <div class="item-tab" v-if="projectForm.includeContractName">
            {{ projectForm.includeContractName }}
          </div>
          <div class="item-tab" v-if="projectForm.projectStatusName">
            {{ projectForm.projectStatusName }}
          </div>
          <img
              src="/src/assets/images/Lament.png"
              alt=""
              style="width: 20px"
              v-if="[1, 3, 5, 6, 7].includes(projectForm.projectStatus)"
              @click="showtooltip = !showtooltip"
          />
          <div class="tooltip" v-if="showtooltip">
            <div class="triangle"></div>
            <div class="contenttext">{{ projectForm.projectStatusRemark }}</div>
          </div>
        </div>
      </div>
      <div class="content-bottom">
        <div class="item">
          <div class="title">项目编号：</div>
          <div class="text">{{ projectForm.projectCode || "--" }}</div>
        </div>
        <div class="item">
          <div class="title">项目执行地：</div>
          <div class="text">{{ projectForm.executiveAddress || "--" }}</div>
        </div>

        <div class="item">
          <div class="title">所属公司：</div>
          <div class="text">{{ projectForm.companyName || "--" }}</div>
        </div>
        <div class="item">
          <div class="title">业务人员：</div>
          <div class="text">{{ projectForm.businessName || "--" }}</div>
        </div>
      </div>
    </div>
    <el-tabs type="border-card" v-model="activeName" @tab-change="changetab">
      <el-tab-pane label="基本信息" name="info">
        <el-collapse v-model="activeNames">
          <!-- 基础信息 -->
          <el-collapse-item name="1" class="transform-down">
            <template #title>
              <span class="circle"></span>
              <span class="collapse-title">基本信息</span>
            </template>

            <div>
              <el-descriptions
                  border
                  style="margin: 20px 0"
                  column="2"
                  label-align="center"
                  align="center"
              >
                <el-descriptions-item
                    label="项目类型"
                    label-class-name="desLabel"
                    class-name="desInfo"
                    label-align="center"
                    align="center"
                >{{
                    projectForm.projectTypeName || "--"
                  }}
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="项目种类"
                    label-class-name="desLabel"
                    class-name="desInfo"
                    label-align="center"
                    align="center"
                >{{
                    projectForm.projectCategoryName || "--"
                  }}
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="项目起止时间"
                    label-class-name="desLabel"
                    label-align="center"
                    align="center"
                >
                  <template
                      v-if="projectForm.dateValue && projectForm.dateValue[0]"
                  >
                    {{ projectForm.dateValue[0] }} 至
                    {{ projectForm.dateValue[1] }}
                  </template>
                  <template v-else> --</template>
                </el-descriptions-item>
                <el-descriptions-item
                    label="关联客户"
                    label-class-name="desLabel"
                    label-align="center"
                    align="center"
                >{{ projectForm.customerName || "--" }}
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="所属行业"
                    label-class-name="desLabel"
                    label-align="center"
                    align="center"
                >{{ projectForm.industryName || "--" }}
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="详细地址"
                    label-class-name="desLabel"
                    label-align="center"
                    align="center"
                >{{ projectForm.address || "--" }}
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="项目金额"
                    label-class-name="desLabel"
                    label-align="center"
                    align="center"
                >
                  <template v-if="projectForm.money">
                    {{ userStore.deptType == 5 ? projectForm.money : "****" }}元
                  </template>
                  <template v-else> --</template>
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="是否签合同"
                    label-class-name="desLabel"
                    label-align="center"
                    align="center"
                >{{
                    projectForm.includeContractName || "--"
                  }}
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="最终使用单位"
                    label-class-name="desLabel"
                    label-align="center"
                    align="center"
                >{{ projectForm.endUseUnit || "--" }}
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="使用单位联系人"
                    label-class-name="desLabel"
                    label-align="center"
                    align="center"
                >
                  <template v-if="projectForm.unitContact">
                    {{ projectForm.unitContact }}-{{
                      projectForm.unitContactInformation
                    }}
                  </template>
                  <template v-else> --</template>
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="质保起止时间"
                    label-class-name="desLabel"
                    label-align="center"
                    align="center"
                >{{
                    projectForm.warrantyStartTime || "--"
                  }}
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="质保终止时间"
                    label-class-name="desLabel"
                    label-align="center"
                    align="center"
                >{{
                    projectForm.warrantyEndTime || "--"
                  }}
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="备注"
                    label-class-name="desLabel"
                    label-align="center"
                    align="center"
                    width="330px"
                >
                  <div class="desContent" :title="projectForm.remarks">
                    {{ projectForm.remarks || "--" }}
                  </div>
                </el-descriptions-item>
              </el-descriptions>
            </div>
          </el-collapse-item>
          <!-- 添加销售清单 -->
          <el-collapse-item
              name="2"
              style="position: relative"
              v-if="saleAddShow && !contactAddShow"
              class="transform-up"
          >
            <template #title>
              <span class="circle"></span>
              <span class="collapse-title">添加销售清单</span>
            </template>
            <div class="project-info">
              <el-form
                  :model="saleForm"
                  ref="saleFormRef"
                  :rules="querySaleRules"
                  label-width="100px"
                  v-enterToNext
              >
                <el-row>
                  <el-col :span="6">
                    <el-form-item label="销售类目：" prop="saleCategory">
                      <el-select
                          ref="refSelect"
                          @change="handleSaleCategory"
                          v-model="saleForm.saleCategory"
                          placeholder="请选择"
                          clearable
                          class="search-select"
                      >
                        <el-option
                            v-for="dict in saleCategoryList"
                            :key="dict.value"
                            :label="dict.label"
                            :value="dict.value"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6" v-if="saleForm.saleCategory === 0">
                    <el-form-item label="设备名称：" prop="materialId">
                      <el-select
                          v-model="saleForm.materialId"
                          style="width: 100%"
                          placeholder="请选择"
                          clearable
                          @change="handleDevice"
                      >
                        <el-option key="0" label="" value="" disabled>
                          <span style="float: left; color: #8492a6"
                          >物料编号</span
                          >
                          <span style="margin: 0 80px 0 18px; color: #8492a6"
                          >物料名称</span
                          >
                          <span
                              style="
                              margin: 0 50px 0 0px;
                              color: #8492a6;
                              font-size: 13px;
                            "
                          >采购名称</span
                          >
                          <span
                              style="
                              margin: 0 50px 0 0px;
                              color: #8492a6;
                              font-size: 13px;
                            "
                          >销售名称</span
                          >
                          <span
                              style="
                              margin: 0 50px 0 0px;
                              color: #8492a6;
                              font-size: 13px;
                            "
                          >出厂型号</span
                          >
                          <span
                              style="
                              margin: 0 50px 0 0px;
                              color: #8492a6;
                              font-size: 13px;
                            "
                          >销售型号</span
                          >
                          <span
                              style="
                              margin: 0 50px 0 0px;
                              color: #8492a6;
                              font-size: 13px;
                            "
                          >技术参数</span
                          >
                          <span
                              style="
                              margin: 0 50px 0 0px;
                              color: #8492a6;
                              font-size: 13px;
                            "
                          >单位</span
                          >
                          <span style="color: #8492a6; font-size: 13px"
                          >生产厂商</span
                          >
                        </el-option>
                        <el-option
                            v-for="item in deviceList"
                            :key="item.materialId"
                            :label="item.saleName"
                            :value="item.materialId"
                        >
                          <span style="float: left; color: #8492a6">{{
                              item.materialCode
                            }}</span>
                          <span
                              style="
                              display: inline-block;
                              width: 125px;
                              margin: 0 10px 0 25px;
                              color: #8492a6;
                              white-space: nowrap;
                              overflow: hidden;
                              text-overflow: ellipsis;
                            "
                              :title="item.materialName"
                          >{{ item.materialName }}</span
                          >
                          <span
                              style="
                              display: inline-block;
                              width: 100px;
                              font-size: 13px;

                              margin-right: 2px;
                              white-space: nowrap;
                              overflow: hidden;
                              text-overflow: ellipsis;
                            "
                              :title="item.purchaseName"
                          >
                            {{ item.purchaseName }}
                          </span>
                          <span
                              style="
                              display: inline-block;
                              width: 100px;
                              font-size: 13px;
                              margin-right: 4px;
                              white-space: nowrap;
                              overflow: hidden;
                              text-overflow: ellipsis;
                            "
                              :title="item.factoryCode"
                          >
                            {{ item.factoryCode }}
                          </span>
                          <span
                              style="
                              display: inline-block;
                              width: 100px;
                              font-size: 13px;
                              margin-right: 2px;
                              white-space: nowrap;
                              overflow: hidden;
                              text-overflow: ellipsis;
                            "
                              :title="item.saleCode"
                          >
                            {{ item.saleCode }}
                          </span>
                          <span
                              style="
                              display: inline-block;
                              width: 100px;
                              font-size: 13px;
                              white-space: nowrap;
                              overflow: hidden;
                              text-overflow: ellipsis;
                            "
                              :title="item.technologyParameter"
                          >
                            {{ item.technologyParameter }}
                          </span>
                          <span
                              style="
                              display: inline-block;
                              width: 100px;
                              font-size: 13px;

                              margin-right: 10px;
                              white-space: nowrap;
                              overflow: hidden;
                              text-overflow: ellipsis;
                            "
                              :title="item.technologyParameter"
                          >
                            {{ item.technologyParameter }}
                          </span>
                          <span
                              style="
                              display: inline-block;
                              width: 70px;
                              font-size: 13px;
                              white-space: nowrap;
                              overflow: hidden;
                              text-overflow: ellipsis;
                            "
                              :title="item.materialUnitName"
                          >
                            {{ item.materialUnitName }}
                          </span>
                          <span
                              style="
                              display: inline-block;
                              width: 100px;
                              font-size: 13px;
                              white-space: nowrap;
                              overflow: hidden;
                              text-overflow: ellipsis;
                            "
                              :title="item.manufactureName"
                          >
                            {{ item.manufactureName }}
                          </span>
                        </el-option>
                      </el-select>
                      <!-- <el-select
                    v-model="saleForm.materialId"
                    placeholder="请选择"
                    clearable
                    class="search-select"
                    @change="handleDevice"
                  >
                    <el-option
                      v-for="dict in deviceList"
                      :key="dict.materialId"
                      :label="dict.saleName"
                      :value="dict.materialId"
                    />
                  </el-select> -->
                    </el-form-item>
                  </el-col>
                  <el-col :span="6" v-if="saleForm.saleCategory === 0">
                    <el-form-item label="单位：">
                      <el-input
                          disabled
                          v-model="saleForm.materialUnitName"
                          placeholder="请输入"
                          clearable
                          class="search-input"
                      />
                    </el-form-item>
                  </el-col>
                  <el-col :span="6" v-if="saleForm.saleCategory === 0">
                    <el-form-item label="技术参数：">
                      <el-input
                          disabled
                          v-model="saleForm.technologyParameter"
                          placeholder="请输入"
                          clearable
                          class="search-input"
                      />
                    </el-form-item>
                  </el-col>
                  <el-col :span="6" v-if="saleForm.saleCategory === 0">
                    <el-form-item label="设备品牌：" prop="brand">
                      <el-input
                          v-model="saleForm.brand"
                          placeholder="请输入"
                          clearable
                          class="search-input"
                      />
                    </el-form-item>
                  </el-col>
                  <el-col :span="6" v-if="saleForm.saleCategory === 0">
                    <el-form-item label="设备数量：" prop="quantity">
                      <el-input
                          v-model="saleForm.quantity"
                          placeholder="请输入"
                          clearable
                          type="Number"
                          class="search-input"
                      />
                    </el-form-item>
                  </el-col>
                  <!-- </el-row>
            <el-row> -->

                  <el-col :span="6" v-if="saleForm.saleCategory === 1">
                    <el-form-item label="平台名称：">
                      <el-input
                          v-model="saleForm.platformName"
                          placeholder="请输入"
                          clearable
                          class="search-input"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="备注：">
                      <el-input
                          maxlength="2000"
                          style="width: 96.2%"
                          v-model="saleForm.remarks"
                          placeholder="请输入"
                          clearable
                          class="search-input"
                          @keyup.enter.stop="handleSaleAdd(saleFormRef)"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-form>
            </div>
          </el-collapse-item>
          <!-- 销售清单明细 -->
          <el-collapse-item
              name="3"
              style="position: relative"
              v-show="!contactAddShow"
              class="transform-down"
          >
            <template #title>
              <span class="circle"></span>
              <span class="collapse-title">销售清单列表</span>
              <div
                  v-if="
                  pageType !== 'detail' && !saleAddShow && pageType !== 'check'
                "
                  class="nofixed-search-button button-position"
              >
                <el-button class="btn add" @click.stop="handleSaleOperate"
                >
                  <el-icon class="icon" color="#fff">
                    <Plus/>
                  </el-icon
                  >
                  添加
                </el-button
                >
              </div>
              <div
                  class="nofixed-search-button button-position"
                  v-else
                  v-if="pageType !== 'detail' && pageType !== 'check'"
              >
                <el-button
                    class="btn add"
                    @click.stop="handleSaleAdd(saleFormRef)"
                >
                  <el-icon class="icon" color="#fff">
                    <Plus/>
                  </el-icon
                  >
                  添加
                </el-button
                >
                <el-button class="btn direction" @click.stop="handleSaleBack"
                >
                  <el-icon class="icon" color="#fff">
                    <ArrowUp/>
                  </el-icon
                  >
                  关闭
                </el-button
                >
              </div>
            </template>
            <div class="contact-info">
              <el-table
                  :data="salesListData"
                  border
                  height="180px"
                  :header-cell-style="{ 'text-align': 'center' }"
              >
                <!-- 操作模式 -->
                <!-- <el-table-column
                label="操作"
                align="center"
                :show-overflow-tooltip="true"
                width="100px"
              >
                <template #default="{ row, $index }">
                  <div class="table-operate">
                    <img
                      src="@/assets/icons/images/edit.png"
                      class="table-icon"
                      title="编辑"
                      @click="handleOperate('edit', row, $index)"
                    />
                    <img
                      src="@/assets/icons/images/delete.png"
                      class="table-icon"
                      title="删除"
                      @click="handleOperate('delete', row, $index)"
                    />
                  </div> </template
              ></el-table-column> -->
                <el-table-column
                    label="销售类目"
                    prop="saleCategoryName"
                    :show-overflow-tooltip="true"
                    min-width="160"
                />
                <el-table-column
                    label="设备品牌"
                    prop="brand"
                    :show-overflow-tooltip="true"
                    min-width="160"
                />
                <el-table-column
                    label="设备/平台名称"
                    prop="purchaseName"
                    :show-overflow-tooltip="true"
                    min-width="160"
                >
                  <template #default="scope">
                    {{
                      scope.row.purchaseName || scope.row.platformName || "--"
                    }}
                  </template>
                </el-table-column>
                <el-table-column
                    label="数量"
                    prop="quantity"
                    :show-overflow-tooltip="true"
                    min-width="160"
                />
                <el-table-column
                    label="技术参数"
                    prop="technologyParameter"
                    :show-overflow-tooltip="true"
                    min-width="160"
                />
              </el-table>
              <!-- 分页 -->
              <pagination
                  class="pagination"
                  :total="total"
                  v-model:page="params.pageNum"
                  v-model:limit="params.pageSize"
                  @pagination="getSaleList"
              />
            </div>
          </el-collapse-item>
          <!-- 添加甲方施工联系人 -->
          <el-collapse-item
              name="4"
              style="position: relative"
              v-if="contactAddShow && !saleAddShow"
              class="transform-up"
          >
            <template #title>
              <span class="circle"></span>
              <span class="collapse-title">添加联系人</span>
            </template>
            <div class="project-info">
              <el-form
                  :model="contactForm"
                  ref="contactFormRef"
                  :rules="queryContactRules"
                  label-width="100px"
                  v-enterToNext
              >
                <el-row>
                  <el-col :span="6">
                    <el-form-item label="姓名：" prop="name">
                      <el-input
                          ref="contactRefInput"
                          v-model="contactForm.name"
                          placeholder="请输入"
                          clearable
                          class="search-input"
                      />
                    </el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="联系方式：" prop="phone">
                      <el-input
                          v-model="contactForm.phone"
                          placeholder="请输入"
                          clearable
                          class="search-input"
                      />
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="备注：">
                      <el-input
                          maxlength="2000"
                          style="width: 100%"
                          v-model="contactForm.remarks"
                          placeholder="请输入"
                          clearable
                          class="search-input"
                          @keyup.enter.stop="handleContactAdd(contactFormRef)"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-form>
            </div>
          </el-collapse-item>
          <!-- 甲方施工联系人 -->
          <el-collapse-item
              name="5"
              style="position: relative; margin-top: 20px; margin-bottom: 20px"
              v-show="!saleAddShow"
          >
            <template #title>
              <span class="circle"></span>
              <span class="collapse-title">甲方施工联系人列表</span>
              <div
                  v-if="
                  pageType !== 'check' &&
                  pageType !== 'detail' &&
                  !contactAddShow
                "
                  class="nofixed-search-button button-position"
              >
                <el-button class="btn add" @click.stop="handleContactOperate"
                >
                  <el-icon class="icon" color="#fff">
                    <Plus/>
                  </el-icon
                  >
                  添加
                </el-button
                >
              </div>
              <div
                  class="nofixed-search-button button-position"
                  v-else
                  v-if="pageType !== 'check' && pageType !== 'detail'"
              >
                <el-button
                    class="btn add"
                    @click.stop="handleContactAdd(contactFormRef)"
                >
                  <el-icon class="icon" color="#fff">
                    <Plus/>
                  </el-icon
                  >
                  添加
                </el-button
                >
                <el-button class="btn direction" @click.stop="handleProjectBack"
                >
                  <el-icon class="icon" color="#fff">
                    <ArrowUp/>
                  </el-icon
                  >
                  关闭
                </el-button
                >
              </div>
            </template>
            <div class="contact-info">
              <el-table
                  :data="constructionData"
                  border
                  height="180px"
                  :header-cell-style="{ 'text-align': 'center' }"
              >
                <!-- 操作模式 -->
                <!-- <el-table-column
                  label="操作"
                  align="center"
                  :show-overflow-tooltip="true"
                  width="100px"
                >
                  <template #default="{ row, $index }">
                    <div class="table-operate">
                      <img
                        src="@/assets/icons/images/edit.png"
                        class="table-icon"
                        title="编辑"
                        @click="handleOperate('edit', row, $index)"
                      />
                      <img
                        src="@/assets/icons/images/delete.png"
                        class="table-icon"
                        title="删除"
                        @click="handleOperate('delete', row, $index)"
                      />
                    </div> </template
                ></el-table-column> -->
                <el-table-column
                    label="姓名"
                    prop="name"
                    :show-overflow-tooltip="true"
                    min-width="160"
                />
                <el-table-column
                    label="联系方式"
                    prop="phone"
                    :show-overflow-tooltip="true"
                    min-width="160"
                />
                <el-table-column
                    label="备注"
                    prop="remarks"
                    :show-overflow-tooltip="true"
                    min-width="200"
                />
              </el-table>
              <!-- 分页 -->
              <pagination
                  class="pagination"
                  :total="constructioTotal"
                  v-model:page="construction.pageNum"
                  v-model:limit="construction.pageSize"
                  @pagination="getConstructionList"
              />
            </div>
          </el-collapse-item>
        </el-collapse>
      </el-tab-pane>
      <el-tab-pane label="运维进度" name="approval">
        <el-collapse v-model="activeNames">
          <!-- 基础信息 -->
          <el-collapse-item name="1" class="transform-down">
            <template #title>
              <span class="circle"></span>
              <span class="collapse-title">运维信息</span>
            </template>

            <div>
              <el-descriptions
                  border
                  style="margin: 20px 0"
                  column="2"
                  label-align="center"
                  align="center"
              >
                <el-descriptions-item
                    label="启动时间"
                    label-class-name="desLabel"
                    class-name="desInfo"
                    label-align="center"
                    align="center"
                >{{
                    projectForm.readyStartTime || "--"
                  }}
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="项目经理"
                    label-class-name="desLabel"
                    class-name="desInfo"
                    label-align="center"
                    align="center"
                >
                  <div>
                    <div v-if="!mouseFlag">
                      <div @mouseover="handleMouseOver(1)">
                        <!-- @mouseleave="handleMouseLeave(1)" -->
                        {{ projectForm.pm || "--" }}
                      </div>
                    </div>
                    <div v-else style="display: flex">
                      <el-select
                          filterable
                          style="width: 80%;height:100%;"
                          v-model="projectForm.pmIds"
                          multiple
                          placeholder="请选择"
                          clearable
                          class="search-input"
                      >
                        <el-option key="0" label="" value="" disabled>
                          <span style="float: left; color: #8492a6"
                          >人员姓名</span
                          >
                          <span style="margin: 0 80px 0 50px; color: #8492a6"
                          >联系方式</span
                          >
                          <span
                              style="
                              margin: 0 100px 0 0px;
                              color: #8492a6;
                              font-size: 13px;
                            "
                          >职位</span
                          >
                          <span style="color: #8492a6; font-size: 13px"
                          >部门</span
                          >
                        </el-option>
                        <el-option
                            v-for="item in userList"
                            :key="item.userId"
                            :label="item.nickName"
                            :value="item.userId"
                        >
                          <span
                              style="
                              display: inline-block;
                              width: 80px;
                              float: left;
                            "
                          >{{ item.nickName }}</span
                          >
                          <span
                              style="
                              display: inline-block;
                              width: 125px;
                              margin: 0 15px 0 23px;
                              color: #8492a6;
                              white-space: nowrap;
                              overflow: hidden;
                              text-overflow: ellipsis;
                            "
                          >{{
                              item.phonenumber ? item.phonenumber : "--"
                            }}</span
                          >
                          <span
                              style="
                              display: inline-block;
                              width: 125px;
                              font-size: 13px;
                              margin: 0 0px 0 0px;
                              transform: translateY(-11px);
                              color: #8492a6;
                            "
                          >
                            {{ item.postName ? item.postName : "--" }}
                          </span>
                          <span
                              style="
                              display: inline-block;
                              margin: 0 0px 0 0px;
                              font-size: 13px;
                              transform: translateY(-11px);
                              color: #8492a6;
                            "
                          >
                            {{ item.fullDeptName ? item.fullDeptName : "--" }}
                          </span>
                        </el-option>
                      </el-select>
                      <div class="submitBtn" @click="handlePoint(1)">
                        确认更换
                      </div>
                    </div>
                  </div>
                </el-descriptions-item>

                <el-descriptions-item
                    label="计划开始时间"
                    label-class-name="desLabel"
                    class-name="desInfo"
                    label-align="center"
                    align="center"
                >{{
                    projectForm.projectStartTime || "--"
                  }}
                </el-descriptions-item
                >
                <el-descriptions-item
                    label="计划结束时间"
                    label-class-name="desLabel"
                    class-name="desInfo"
                    label-align="center"
                    align="center"
                >
                  <div>
                    <div
                      v-if="!mouseFlag1"
                    >
                      <!-- @mouseover="handleMouseOver(2)"
                      @mouseleave="handleMouseLeave(2)" -->
                      {{ projectForm.projectEndTime || "--" }}
                    </div>
                    <div v-else style="display: flex">
                      <el-date-picker
                          style="width: 80%"
                          value-format="YYYY-MM-DD HH:mm:ss"
                          v-model="projectForm.projectEndTime1"
                          class="search-input"
                          type="datetime"
                          placeholder="请选择"
                      />
                      <div class="submitBtn" @click="handlePoint(2)">
                        确认更换
                      </div>
                    </div>
                  </div>

                  <!--  -->
                </el-descriptions-item>
              </el-descriptions>
            </div>
            <div class="schedule-form">
              <el-form
                  :model="scheduleForm"
                  ref="scheduleFormRef"
                  :rules="queryRules"
                  label-width="100px"
              >
                <div class="form">
                  <div class="form-left">
                    <div class="item"></div>
                    <div
                        class="item"
                        :class="activeindex == index ? 'activeitem' : ''"
                        v-for="(item, index) in taskList"
                        :key="index"
                        @click="handlerBusSchedule(item, index)"
                    >
                      {{ item.label }} ({{ item.type }})
                    </div>
                  </div>
                  <div class="form-right">
                    <div class="right-title">
                      {{ presentBusinessScheduleName }}
                    </div>
                    <div style="font-weight: 600;font-size: 18px;">任务分配</div>
                    <div class="right-form">
                      <el-descriptions
                          border
                          style="margin: 20px 0"
                          column="2"
                          label-align="center"
                          align="center"
                      >
                        <el-descriptions-item
                            label="计划开始时间"
                            label-class-name="desLabel"
                            label-align="center"
                            align="center"
                        >{{
                            formdata.startTime || "--"
                          }}
                        </el-descriptions-item
                        >
                        <el-descriptions-item
                            label="预计结束时间"
                            label-class-name="desLabel"
                            label-align="center"
                            align="center"
                        >{{
                            formdata.endTime ||
                            "--"
                          }}
                        </el-descriptions-item
                        >
                        <el-descriptions-item
                            label="责任人员"
                            label-class-name="desLabel"
                            label-align="center"
                            align="center"
                        >
                          <div>
                            <div v-if="true">
                              <div @mouseover="handleMouseOver()">
                                {{
                                  formdata.executor || "--"
                                }}
                              </div>
                            </div>
                            <div v-else style="display: flex">
                              <el-select
                                  filterable
                                  style="width: 80%;height:100%;"
                                  v-model="formdata.allotRelList"
                                  multiple
                                  placeholder="请选择"
                                  clearable
                                  class="search-input"
                              >
                                <el-option key="0" label="" value="" disabled>
                          <span style="float: left; color: #8492a6"
                            >人员姓名</span
                          >
                          <span style="margin: 0 80px 0 50px; color: #8492a6"
                            >联系方式</span
                          >
                          <span
                            style="
                              margin: 0 100px 0 0px;
                              color: #8492a6;
                              font-size: 13px;
                            "
                            >职位</span
                          >
                          <span style="color: #8492a6; font-size: 13px"
                            >部门</span
                          >
                        </el-option>
                        <el-option
                          v-for="item in userList"
                          :key="item.userId"
                          :label="item.nickName"
                          :value="item.userId"
                        >
                          <span
                            style="
                              display: inline-block;
                              width: 80px;
                              float: left;
                            "
                            >{{ item.nickName }}</span
                          >
                          <span
                            style="
                              display: inline-block;
                              width: 125px;
                              margin: 0 15px 0 23px;
                              color: #8492a6;
                              white-space: nowrap;
                              overflow: hidden;
                              text-overflow: ellipsis;
                            "
                            >{{
                              item.phonenumber ? item.phonenumber : "--"
                            }}</span
                          >
                          <span
                            style="
                              display: inline-block;
                              width: 125px;
                              font-size: 13px;
                              margin: 0 0px 0 0px;
                              transform: translateY(-11px);
                              color: #8492a6;
                            "
                          >
                            {{ item.postName ? item.postName : "--" }}
                          </span>
                          <span
                            style="
                              display: inline-block;
                              margin: 0 0px 0 0px;
                              font-size: 13px;
                              transform: translateY(-11px);
                              color: #8492a6;
                            "
                          >
                            {{ item.fullDeptName ? item.fullDeptName : "--" }}
                          </span>
                        </el-option>
                      </el-select>
                      <div class="submitBtn" @click="handlePoint(1)">
                        确认更换
                      </div>
                    </div>
                  </div>
              </el-descriptions-item
            >
            <el-descriptions-item
              label="任务内容"
              label-class-name="desLabel"
              label-align="center"
              align="center"
              >{{
                formdata.remark || "--"
              }}</el-descriptions-item
            >
          </el-descriptions>
                  
                    </div>
                    <div style="font-weight: 600;font-size: 18px;">最新情况说明</div>
                    <div class="right-form">
                      <el-descriptions
                          border
                          style="margin: 20px 0"
                          column="2"
                          label-align="center"
                          align="center"
                      >
                        <el-descriptions-item
                            label="实际开始时间"
                            label-class-name="desLabel"
                            label-align="center"
                            align="center"
                        >{{
                            formdata.actualStartTime || "--"
                          }}
                        </el-descriptions-item
                        >
                        <el-descriptions-item
                            label="实际结束时间"
                            label-class-name="desLabel"
                            label-align="center"
                            align="center"
                        >{{
                            formdata.finishTime ||
                            "--"
                          }}
                        </el-descriptions-item
                        >
                        <el-descriptions-item
                            label="完成情况"
                            label-class-name="desLabel"
                            label-align="center"
                            align="center"
                        >{{
                            formdata.performance || "--"
                          }}
                        </el-descriptions-item
                        >
                        <el-descriptions-item
                            label="相关文档"
                            label-class-name="desLabel"
                            label-align="center"
                            align="center"
                        >
                          <!-- <template v-if='formdata.ywProjectTaskDetailInfoRespVos'>
                            <span
                                v-for="(item, index) in formdata.ywProjectTaskDetailInfoRespVos"
                                :key="index"
                                @click="handleFileClick(item)"
                                class="fileText"
                                style="cursor: pointer"
                            >
                                  {{
                                formdata.ywProjectTaskDetailInfoRespVos || "--"
                              }}
                                <span
                                    style="color: #000"
                                    v-if="index + 1 !== formdata.ywProjectTaskDetailInfoRespVos.length"
                                >，</span
                                ></span
                            >
                          </template> -->
                          <span>
                          <div v-if="formdata.ywProjectTaskDetailInfoRespVos">
                            <span style="cursor: pointer" @click="handleFileClick(item)" v-for="(item,index) in formdata.ywProjectTaskDetailInfoRespVos" :key="index" >
                        {{item.name}}
                        <span v-if="index >formdata.ywProjectTaskDetailInfoRespVos.length">,</span>
                      </span>
                          </div>
                          <span v-else>--</span>
                       </span>
                        </el-descriptions-item
                        >
                      </el-descriptions>
                    </div>
                  </div>
                </div>
              </el-form>
            </div>
          </el-collapse-item>
          <!-- 基础信息 -->
          <el-collapse-item name="2">
            <!-- class="transform-down" -->
            <template #title>
              <span class="circle"></span>
              <span class="collapse-title">现场点位</span>
            </template>
            <div class="contact-info">
              <div class="contact-table-info">
                <div v-if="!pointData.length">暂无数据</div>
                <div
                  class="box-item"
                  v-for="(item, index) in pointData"
                  :key="index"
                >
                  <div style="font-size: 16px" class="mb10">
                    {{ item.pointAdd }}
                  </div>
                  <div class="mb10">{{ item.detailAdd }}</div>
                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">物业名称：</span>
                      <span class="box-content">{{ item.propertyName }}</span>
                    </div>
                    <div class="item" style="margin-left: 20px">
                      <span class="box-title">物业联系方式：</span>
                      <span class="box-content">{{ item.propertyWay }}</span>
                    </div>
                  </div>
                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">派出所：</span>
                      <span class="box-content">{{ item.policeOffice }}</span>
                    </div>
                    <div class="item" style="margin-left: 20px">
                      <span class="box-title">派出所联系方式：</span>
                      <span class="box-content">{{ item.policeWay }}</span>
                    </div>
                  </div>

                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">租赁合同：</span>
                      <div v-if="item.suppFileInfoVos7.length">
                        <Upload
                          :fileList="item.suppFileInfoVos7"
                          :limit="10"
                          limitation="templatelimitation"
                          accept=".doc,.docx"
                          :isFull="true"
                          :isCanDelete="false"
                          :disabled="false"
                          :showButton="false"
                        />
                      </div>
                      <div v-else>暂无文件</div>
                    </div>
                  </div>
                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">现场照片：</span>
                      <div v-if="item.suppFileInfoVos1.length">
                        <Upload
                          :fileList="item.suppFileInfoVos1"
                          :limit="10"
                          limitation="templatelimitation"
                          accept=".doc,.docx"
                          :isFull="true"
                          :isCanDelete="false"
                          :disabled="false"
                          :showButton="false"
                        />
                      </div>
                      <div v-else>暂无文件</div>
                    </div>
                  </div>
                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">外包合同：</span>

                      <div v-if="item.suppFileInfoVos2.length">
                        <Upload
                          :fileList="item.suppFileInfoVos2"
                          :limit="10"
                          limitation="templatelimitation"
                          accept=".doc,.docx"
                          :isFull="true"
                          :isCanDelete="false"
                          :disabled="false"
                          :showButton="false"
                        />
                      </div>
                      <div v-else>暂无文件</div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </el-collapse-item>
          <!-- 基础信息 -->
          <el-collapse-item name="3">
            <!-- class="transform-down" -->
            <template #title>
              <span class="circle"></span>
              <span class="collapse-title">安装设备</span>
            </template>
            <div class="contact-info">
              <div class="contact-table-info">
                <div v-if="!deviceData.length">暂无数据</div>
                <div
                  class="box-item"
                  v-for="(item, index) in deviceData"
                  :key="index"
                >
                  <div style="font-size: 16px" class="mb10">
                    {{ item.deviceName }}
                  </div>
                  <div class="mb10">设备编号：{{ item.deviceUuid }}</div>
                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">所属防区：</span>
                      <span class="box-content">{{ item.armedzoneName }}</span>
                    </div>
                    <div class="item" style="margin-left: 20px">
                      <span class="box-title">安装点位：</span>
                      <span class="box-content">{{ item.pointNameChi }}</span>
                    </div>
                  </div>
                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">设备型号：</span>
                      <span class="box-content">{{ item.deviceModel }}</span>
                    </div>
                    <div class="item" style="margin-left: 20px">
                      <span class="box-title">设备类型：</span>
                      <span class="box-content">{{ item.deviceTypeName }}</span>
                    </div>
                  </div>

                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">安装时间：</span>
                      <span class="box-content">{{ item.installTime }}</span>
                    </div>
                    <div class="item" style="margin-left: 20px">
                      <span class="box-title">安装方式：</span>
                      <span class="box-content">{{ item.installType }}</span>
                    </div>
                  </div>

                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">IP地址：</span>
                      <span class="box-content">{{ item.ipAddress }}</span>
                    </div>
                    <div class="item" style="margin-left: 20px">
                      <span class="box-title">路由器品牌型号：</span>
                      <span class="box-content">{{ item.routBrand }}</span>
                    </div>
                  </div>

                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">SIM卡信息：</span>
                      <span class="box-content">{{ item.simCard }}</span>
                    </div>
                    <div class="item" style="margin-left: 20px">
                      <!-- <span class="box-title">设备类型：</span>
                  <span class="box-content">{{item.policeWay}}</span> -->
                    </div>
                  </div>

                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">配件清单表：</span>

                      <div v-if="item.suppFileInfoVos3.length">
                        <Upload
                          :fileList="item.suppFileInfoVos3"
                          :limit="10"
                          limitation="templatelimitation"
                          accept=".doc,.docx"
                          :isFull="true"
                          :isCanDelete="false"
                          :disabled="false"
                          :showButton="false"
                          @success="(result) => uploadSuccess(result, 7)"
                          @deleteFile="(result) => uploadRemove(result, 7)"
                        />
                      </div>
                      <div v-else>暂无文件</div>
                    </div>
                  </div>
                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">用电协议：</span>
                      <div v-if="item.suppFileInfoVos4.length">
                        <Upload
                          :fileList="item.suppFileInfoVos4"
                          :limit="10"
                          limitation="templatelimitation"
                          accept=".doc,.docx"
                          :isFull="true"
                          :isCanDelete="false"
                          :disabled="false"
                          :showButton="false"
                          @success="(result) => uploadSuccess(result, 7)"
                          @deleteFile="(result) => uploadRemove(result, 7)"
                        />
                      </div>
                      <div v-else>暂无文件</div>
                    </div>
                  </div>
                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">现场完成照片：</span>

                      <div v-if="item.suppFileInfoVos5.length">
                        <Upload
                          :fileList="item.suppFileInfoVos5"
                          :limit="10"
                          limitation="templatelimitation"
                          accept=".doc,.docx"
                          :isFull="true"
                          :isCanDelete="false"
                          :disabled="false"
                          :showButton="false"
                          @success="(result) => uploadSuccess(result, 7)"
                          @deleteFile="(result) => uploadRemove(result, 7)"
                        />
                      </div>
                      <div v-else>暂无文件</div>
                    </div>
                  </div>
                  <div class="item mb10">
                    <div class="item">
                      <span class="box-title">现场设备照片：</span>

                      <div v-if="item.suppFileInfoVos6.length">
                        <Upload
                          :fileList="item.suppFileInfoVos6"
                          :limit="10"
                          limitation="templatelimitation"
                          accept=".doc,.docx"
                          :isFull="true"
                          :isCanDelete="false"
                          :disabled="false"
                          :showButton="false"
                          @success="(result) => uploadSuccess(result, 7)"
                          @deleteFile="(result) => uploadRemove(result, 7)"
                        />
                      </div>
                      <div v-else>暂无文件</div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </el-collapse-item>
          <el-collapse-item name="4" class="transform-down">
            <template #title>
              <span class="circle"></span>
              <span class="collapse-title">续保记录</span>
            </template>
            <div>
              <div class="contact-info">
                <el-table
                  :data="renewalData"
                  border
                  height="180px"
                  :header-cell-style="{ 'text-align': 'center' }"
                >
                  <el-table-column
                    type="index"
                    label="序号"
                    width="70"
                    align="center"
                  />
                  <el-table-column
                    label="质保开始时间"
                    prop="startTime"
                    :show-overflow-tooltip="true"
                    min-width="160"
                  />
                  <el-table-column
                    label="质保截止时间"
                    prop="endTime"
                    :show-overflow-tooltip="true"
                    min-width="160"
                  />
                  <el-table-column
                    label="相关文档"
                    prop="suppFileInfoVos"
                    :show-overflow-tooltip="true"
                    min-width="160"
                  > <template #default="{ row, $index }">
                      <div v-for="(item,index) in row.suppFileInfoVos" :key="index">
                        {{item.name}}<span v-if="index > row.suppFileInfoVos.length">,</span>
                      </div> </template
                  ></el-table-column>
                  <el-table-column
                    label="创建人"
                    prop="creatUserName"
                    :show-overflow-tooltip="true"
                    min-width="160"
                  />
                  <el-table-column
                    label="创建时间"
                    prop="createTime"
                    :show-overflow-tooltip="true"
                    min-width="160"
                  />
                  <!-- 操作模式 -->
                  <el-table-column
                    label="操作"
                    align="center"
                    :show-overflow-tooltip="true"
                    width="60px"
                  >
                    <template #default="{ row, $index }">
                      <div class="table-operate">
                        <img
                          src="@/assets/icons/images/edit.png"
                          class="table-icon"
                          title="更新"
                          @click="renewalAdd(row, $index)"
                        />
                      </div> </template
                  ></el-table-column>
                </el-table>
                <!-- 分页 -->
                <pagination
                  class="pagination"
                  :total="renewalTotal"
                  v-model:page="renewalParams.pageNum"
                  v-model:limit="renewalParams.pageSize"
                  @pagination="getRenewalList"
                />
              </div>
            </div>
          </el-collapse-item>

          <el-collapse-item name="5" class="transform-down">
            <template #title>
              <span class="circle"></span>
              <span class="collapse-title">项目工单</span>
            </template>
            <div>
              <div class="contact-info">
                <el-table
                  :data="workData"
                  border
                  height="180px"
                  :header-cell-style="{ 'text-align': 'center' }"
                >
                  <el-table-column
                    type="index"
                    label="序号"
                    width="70"
                    align="center"
                  />
                  <el-table-column
                    label="工单类型"
                    prop="typeName"
                    :show-overflow-tooltip="true"
                    min-width="160"
                  />
                  <el-table-column
                    label="工单名称"
                    prop="name"
                    :show-overflow-tooltip="true"
                    min-width="160"
                  />
                  <el-table-column
                    label="问题描述"
                    prop="remark"
                    :show-overflow-tooltip="true"
                    min-width="160"
                  />
                  <el-table-column
                    label="申请人"
                    prop="createUserName"
                    :show-overflow-tooltip="true"
                    min-width="160"
                  />
                  <el-table-column
                    label="提交时间"
                    prop="createTime"
                    :show-overflow-tooltip="true"
                    min-width="160"
                  />
                  <el-table-column
                    label="工单状态"
                    prop="statusName"
                    :show-overflow-tooltip="true"
                    min-width="160"
                  />
                  <!-- 操作模式 -->
                  <el-table-column
                    label="操作"
                    align="center"
                    :show-overflow-tooltip="true"
                    width="60px"
                  >
                    <template #default="{ row, $index }">
                      <div class="table-operate">
                        <img
                          src="@/assets/icons/images/detail.png"
                          class="table-icon"
                          title="查看"
                          @click="handleWorkDetail(row)"
                        />
                      </div> </template
                  ></el-table-column>
                </el-table>
                <!-- 分页 -->
                <pagination
                  class="pagination"
                  :total="workTotal"
                  v-model:page="workParams.pageNum"
                  v-model:limit="workParams.pageSize"
                  @pagination="getWorkList"
                />
              </div>
            </div>
          </el-collapse-item>
        </el-collapse>
      </el-tab-pane>
    </el-tabs>

    <el-dialog
      :title="'项目完结'"
      v-model="auditDialogShow"
      width="720px"
      append-to-body
    >
    <div style="display:flex;">
    <div>
      <img src="../../../assets/images/none-icon.png" style="width: 249px;
    height: 209px;" alt="">
    </div>
      <div>
        <div class="dialog-title-accep">确认项目完结？</div>
      <div class="dialog-title2" v-if="projectForm.taskNumber !== 0">
        检测发现有 {{projectForm.taskNumber || 0}} 个项任务未完成，请完成后再尝试！
      </div>
      <div class="dialog-title2" v-else>
        请再次确认项目施工完结，提交后不可修改！
      </div>
      </div>
   </div>
      
      

      <template #footer>
        <div class="dialog-footer">
          <el-button
            style="color: #fff; background-color: rgba(67, 207, 124, 1)"
            @click="saveCheck()"
            v-loading="loadingCheck"
            >确 认</el-button
          >
          <el-button style="background-color: #fff" @click="closeAudit()"
            >取 消</el-button
          >
        </div>
      </template>
    </el-dialog>
    <el-dialog
      :title="''"
      v-model="evaluateDialogShow"
      width="600px"
      append-to-body
    >
      <el-form-item label="评论内容：" label-width="90">
        <el-input
          style="width: 100%"
          v-model="evaluateInfo"
          placeholder=""
          type="textarea"
          rows="5"
          maxlength="500"
          clearable
        />
      </el-form-item>
      <template #footer>
        <div class="dialog-footer">
          <el-button
            style="color: #fff; background-color: rgba(67, 207, 124, 1)"
            @click="saveEvaluate()"
            >保存</el-button
          >

          <el-button style="background-color: #fff" @click="closeEvaluate()"
            >取 消</el-button
          >
        </div>
      </template>
    </el-dialog>

    <!-- 跟进弹窗 -->
    <el-dialog
      title="项目启动会"
      v-model="isfollowAddShow"
      width="800px"
      append-to-body
    >
      <FollowAdd
        v-if="isfollowAddShow"
        ref="isfollowAddRef"
        v-model:followAddShow="isfollowAddShow"
        pageType="isfollow"
        @refreshList="projectForm.practiceStatus = 1"
      />
    </el-dialog>

    <el-dialog
      title="续保合同"
      v-model="renewalAddShow"
      width="800px"
      append-to-body
    >
      <RenewalAdd
        v-if="renewalAddShow"
        ref="renewalAddRef"
        v-model:renewalAddShow="renewalAddShow"
        :pageType="pageType"
        @refreshList="getRenewalList"
      />
    </el-dialog>

    <!-- 巡检弹窗 -->
    <el-dialog
      v-if="showPolling"
      title="任务分配"
      v-model="showPolling"
      width="1400px"
      append-to-body
      class="dialogBox"
    >
      <ProjectAdd
        ref="showPollingRef"
        v-model:followAddShow="showPolling"
        :rowdata="rowdataPolling"
      />
      <template #footer>
        <!--  class="customer-info" -->
        <div class="dialog-footer">
          <el-button
            style="color: #fff; background-color: rgba(67, 207, 124, 1)"
            @click="handlePollingAdd"
            >提交计划</el-button
          >
          <el-button style="background-color: #fff" @click="handlePollingBack()"
            >取 消</el-button
          >
        </div>
      </template>
    </el-dialog>

    <!-- 进度弹窗 -->
    <el-dialog
      title=""
      v-model="showschedule"
      width="1400px"
      class="dialogBox"
      append-to-body
    >
      <Schedule
        v-if="showschedule"
        ref="showscheduleRef"
        v-model:followAddShow="showschedule"
        @getBusScheduleList="getBusScheduleList"
        @refreshList="handleDetailInfo(rowdata)"
        :rowdata="rowdata"
      />
      <template #footer>
        <!--  class="customer-info" -->

        <div class="dialog-footer">
          <el-button
            style="color: #fff; background-color: rgba(67, 207, 124, 1)"
            @click="handlescheduleAdd"
            >保存</el-button
          >

          <el-button
            style="background-color: #fff"
            @click="handlescheduleBack()"
            >取 消</el-button
          >
        </div>
      </template>
    </el-dialog>

    <!--  工单详情  -->
    <ProjectDetail
      v-if="workOrderDetailShow"
      ref="projectCheckRef"
      v-model:projectAddShow="workOrderDetailShow"
      @updateFollowAddShow="followAddShow = false"
    />
  </div>
</template>

<script setup>
import ProjectDetail from "@/views/operation/workApply/projectDetail.vue";
import RenewalAdd from "./renewalAdd.vue";
import ProjectAdd from "./projectAdd.vue";
import FollowAdd from "./followAdd";
import Schedule from "./schedule";
import { addEvaluateApi, getEvaluateListApi } from "@/api/pub.js";
import {
  getProvinceApi,
  // getCustomerListApi,
  getUserListApi,
} from "@/api/information/customer";
import {
  projectFinishApi,
  projectTaskDetailApi,
  getRenewalListApi,
  getWorkListApi,
  projectDetailEditApi,
  findProjectMyTaskInfosById
} from "@/api/operation/project";
import { getCustomerListApi } from "@/api/sales/contract";
import Upload from "@/components/Upload/index";
import { Base64 } from "js-base64";
import {
  addProjectApi,
  // getProjectApi,
  editProjectApi,
  checkupdateProjectApi,
  selectAuditList,
} from "@/api/sales/project";
import { getBusScheduleListByProjectId } from "@/api/sales/marketing.js";
import {
  selectPracticeInfosByProjectIdAdd,
  selectSaleByProjectIdAdd,
} from "@/api/sales/projectRequirements";
import { getallMaterialListApi } from "@/api/information/material";
import { getDictsApi } from "@/api/dict";
import { ElMessage, ElMessageBox } from "element-plus";
import useUserStore from "@/store/modules/user";
const userStore = useUserStore();
const route = useRoute();
const emit = defineEmits([
  // 项目新增组件显隐
  "contractDtlShow",
  // 更新项目新增组件显隐
  "update:contractDtlShow",
  // 刷新父组件表格数据
  "refreshList",
  // 更新跟进组件显隐
  "updateFollowAddShow",
]);
const props = defineProps({
  // 操作类型
  pageType: {
    type: String,
    default: "add",
  },
});
// 搜索参数
const params = reactive({
  pageNum: 1,
  pageSize: 50,
});
// 总数
const total = ref(0);
const construction = reactive({
  pageNum: 1,
  pageSize: 50,
});

const renewalParams = reactive({
  pageNum: 1,
  pageSize: 50,
});
const workParams = reactive({
  pageNum: 1,
  pageSize: 50,
});
// 工单详情弹窗
const workOrderDetailShow = ref(false);
const projectCheckRef = ref();
// 总数
const constructioTotal = ref(0);
// 续保总数
const renewalTotal = ref(0);
const workTotal = ref(0);
//施工联系人数据
const constructionData = ref([]);
// 续保记录
const renewalData = ref([]);
// 工单记录
const workData = ref([]);
//销售清单数据
const salesListData = ref([]);
const activeName = ref("info");
// 折叠栏默认展开
const activeNames = ref(["1", "2", "3", "4", "5"]);
// 客户表单引用
const projectFormRef = ref();
// 联系人表单引用
const contactFormRef = ref();
// 销售表单引用
const saleFormRef = ref();
// 联系人操作类型
const operateType = ref("");
// 详情加载效果
const detailInfoShow = ref(false);
// 联系人当前索引(编辑联系人使用)
const tableIndex = ref(null);
// 销售清单当前索引(编辑销售清单使用)
const tableIndexSec = ref(null);
// 输入框引用
const refInput = ref();
// 联系人输入框引用
const contactRefInput = ref();
// 下拉框引用
const refSelect = ref();
// 选择审核
const auditDialogShow = ref(false);
// 评论
const evaluateDialogShow = ref(false);
// 评论内容
const evaluateInfo = ref("");
const title = ref("");
// 评论列表
const evaluateList = ref([]);
const loadingCheck = ref(false);
// 销售项目类目列表
const saleCategoryList = ref([]);
// 是否签合同列表
const contractList = ref([]);
// 是否中标列表
const successfulList = ref([]);
// 项目种类列表
const kindList = ref([]);
// 所属行业
const industryList = ref([]);
// 项目状态列表
const statusList = ref([]);
// 项目类型列表
const typeList = ref([]);
// 客户列表
const customerList = ref([]);
// 设备列表
const deviceList = ref([]);

//审核进度数据
const flowInfoList = ref([]);
//当前进度
const flowingStep = ref(0);
// 跟进组件引用
const followAddRef = ref(null);
// 状态值
const statusVal = ref(null);
// 跟进组件显隐
const followAddShow = ref(false);
//更进弹窗显隐
const isfollowAddShow = ref(false);
const renewalAddShow = ref(false);
//商务进度详情
let scheduleForm = ref({
  contractTemplate: [],
  projectPracticeInfoRespVos: [],
});
// 校验规则
const schedulequeryRules = {
  includeContract: [
    { required: true, message: "请选择合同签订状态", trigger: "change" },
  ],
  content: [{ required: true, message: "请输入跟进内容", trigger: "blur" }],
  // nextFollowTime: [
  //   { required: true, message: "请选择下次跟进", trigger: "change" },
  // ],
};
let BusScheduleList = reactive([
  {
    name: "确认需求",
    fileInfoVos: [],
    businessSchedule: 1,
  },
  {
    name: "售前支持",
    fileInfoVos: [],
    businessSchedule: 2,
  },
  {
    name: "方案报价",
    fileInfoVos: [],
    businessSchedule: 3,
  },
  {
    name: "甲方立项",
    fileInfoVos: [],
    businessSchedule: 4,
  },
  {
    name: "启动招标",
    fileInfoVos: [],
    businessSchedule: 5,
  },
  {
    name: "项目投标",
    fileInfoVos: [],
    businessSchedule: 6,
  },
  {
    name: "合同谈判",
    fileInfoVos: [],
    businessSchedule: 7,
  },
  {
    name: "达成交易",
    fileInfoVos: [],
    businessSchedule: 8,
  },
  {
    name: "项目初验",
    fileInfoVos: [],
    businessSchedule: 9,
  },
  {
    name: "项目终验",
    fileInfoVos: [],
    businessSchedule: 10,
  },
]);

//左侧表单数据
let formdata = ref(BusScheduleList[0]);
//进度详情的显隐
let showschedule = ref(false);
let presentBusinessScheduleName = ref("");

//进度详情的显隐
let showPolling = ref(false);

let rowdataPolling = ref(null);
// 处理进度保存
let showPollingRef = ref(null);
const handlePollingAdd = () => {
  showPollingRef.value.handleraddbusSchedule();
};
const handlePollingBack = () => {
  showPolling.value = false;
};

let auditList = ref([]);
const pointData = ref([]);
const deviceData = ref([]);
// 新增联系人表单显隐
const contactAddShow = ref(false);
// 新增销售列表表单显隐
const saleAddShow = ref(false);
const mouseFlag = ref(false);
const mouseFlag1 = ref(false);
const delayedRecovery = ref(true);
const delayedRecovery1 = ref(true);

// 处理鼠标移入
const handleMouseOver = (type) => {
  // 判断更改权限
  if(projectForm.value.manHour === 1) {
    switch (type) {
      case 1:
        if (delayedRecovery.value) {
          mouseFlag.value = true;
        }
  
        break;
      case 2:
        if (delayedRecovery1.value) {
          mouseFlag1.value = true;
        }
        break;
      case 3:
        // mouseFlag2.value = true;
        break;
      default:
        break;
    }
  }
};

// 处理鼠标移出
const handleMouseLeave = (type) => {
  switch (type) {
    case 1:
      mouseFlag.value = false;
      console.log("移出");
      break;
    case 2:
      mouseFlag1.value = false;
      break;
    case 3:
      mouseFlag2.value = false;
      break;
    default:
      break;
  }
};

// 处理鼠标手势提交
const handlePoint = async (type) => {
  switch (type) {
    case 1:
      delayedRecovery.value = false;
      mouseFlag.value = false;
      const info = {
        pmList: projectForm.value.pmIds,
        // projectEndTime: "",
        projectId: projectForm.value.projectId,
        projectStartId: projectForm.value.projectStartId,
        // projectStartTime: "",
      };
      const res = await projectDetailEditApi(info);
      setTimeout(() => {
        delayedRecovery.value = true;
      }, 2000);
      if (res.code === 200) {
        ElMessage.success(res.msg);
        handleDetailInfo({projectId:projectForm.value.projectId})
      } else {
        ElMessage.error(res.msg);
      }

      break;
    case 2:
      delayedRecovery1.value = false;
      mouseFlag1.value = false;
      const info1 = {
        // pmList: projectForm.value.pmIds,
        projectEndTime: projectForm.value.projectEndTime1,
        projectId: projectForm.value.projectId,
        projectStartId: projectForm.value.projectStartId,
        // projectStartId: null,
        // projectStartTime: "",
      };
      const res1 = await projectDetailEditApi(info1);
      setTimeout(() => {
        delayedRecovery1.value = true;
      }, 1000);
      console.log("处理鼠标手势提交", type);
      console.log(res1);
      if (res1.code === 200) {
        ElMessage.success(res1.msg);
        handleDetailInfo({projectId:projectForm.value.projectId})
      } else {
        ElMessage.error(res1.msg);
      }
      
      break;
    case 3:
      // mouseFlag2.value = false;
      break;
    default:
      break;
  }
};

//提示的显隐
const showtooltip = ref(false);
//省市区校验规则
const provinceValidate = (rule, value, callback) => {
  const { province, city, area } = projectForm.value;
  if (!province || !city || !area) {
    callback(new Error("请选择省市区"));
  } else {
    callback();
  }
};
// 项目表单模板
const projectFormTemplate = {
  address: "",
  area: null,
  arrivalStatus: null,
  checkStatus: null,
  checkTime: "",
  city: null,
  constructionAddress: "",
  customerId: null,
  endTime: "",
  includeContract: null,
  installationCompletionTime: "",
  money: null,
  planContractTime: "",
  practiceStatus: null,
  probability: "",
  projectCategory: null,
  projectName: "",
  projectPracticeInfoRespVos: [],
  projectSaleInfoRespVos: [],
  projectStatus: null,
  projectType: null,
  province: null,
  remarks: "",
  startTime: "",
  userId: null,
  type: 0,
  successfulBidder: null,
  dateValue: [],
  bidderPictures: [],
};
//自定义数字限制
const digitalRestrictions = (rule, value, callback) => {
  if (value < 0 || value > 9999) {
    callback(new Error("请输入0-9999之内的数字"));
  } else {
    callback();
  }
};
const data = reactive({
  // 项目表单
  projectForm: JSON.parse(JSON.stringify(projectFormTemplate)),
  // 联系人表单
  contactForm: {
    name: "",
    phone: "",
    practiceId: null,
    projectId: null,
    remarks: "",
  },
  // 销售清单表单
  saleForm: {
    brand: "",
    saleName: "",
    materialId: null,
    materialUnit: null,
    materialUnitName: "",
    platformName: "",
    technologyParameter: "",
    projectId: null,
    projectSaleId: null,
    quantity: null,
    remarks: "",
    saleCategory: null,
    saleCategoryName: "",
    saleName: "",
  },
  // 项目表单校验规则
  queryRules: {
    projectName: [
      { required: true, message: "请输入项目名称", trigger: "blur" },
    ],
    userId: [{ required: true, message: "请选择业务人员", trigger: "change" }],
    projectStatus: [
      { required: true, message: "请选择项目状态", trigger: "change" },
    ],
    projectType: [
      { required: true, message: "请选择项目类型", trigger: "change" },
    ],
    dateValue: [
      { required: true, message: "请选择项目起止时间", trigger: "change" },
    ],
    projectCategory: [
      { required: true, message: "请选择项目种类", trigger: "change" },
    ],
    industry: [
      { required: true, message: "请选择所属行业", trigger: "change" },
    ],
    customerId: [
      { required: true, message: "请选择关联客户", trigger: "change" },
    ],
    city: [
      {
        required: true,
        validator: provinceValidate,
        message: "请选择省市区",
        trigger: "change",
      },
    ],
    address: [
      { required: true, message: "请输入详细地址", trigger: "change" },
      { min: 0, max: 24, message: "最多可输入25个字符", trigger: "blur" },
    ],
    probability: [
      { required: true, message: "请输入成交概率预估", trigger: "blur" },
      { validator: digitalRestrictions, trigger: "blur" },
    ],
    money: [
      { required: true, message: "请输入项目金额", trigger: "blur" },
      {
        pattern: /^\d{1,20}(\.\d+)?$/,
        message: "只能输入最多20位数字",
        trigger: "blur",
      },
    ],
    includeContract: [
      { required: true, message: "请选择是否签合同", trigger: "change" },
    ],
    successfulBidder: [
      { required: true, message: "请选择是否中标", trigger: "change" },
    ],
    planContractTime: [
      { required: true, message: "请选择计划成交合同时间", trigger: "change" },
    ],
    checkTime: [
      { required: true, message: "请选择验收日期", trigger: "change" },
    ],
    constructionAddress: [
      { required: true, message: "请输入施工地址", trigger: "blur" },
    ],
    installationCompletionTime: [
      { required: true, message: "请选择期望安装完成日期", trigger: "change" },
    ],
    endUseUnit: [
      { required: true, message: "请填写最终使用单位", trigger: "blur" },
    ],
    unitContact: [
      { required: true, message: "请填写使用单位联系人", trigger: "blur" },
    ],
    unitContactInformation: [
      {
        required: true,
        message: "请填写使用单位联系人联系方式",
        trigger: "blur",
      },
    ],
  },
  // 联系人表单校验规则
  queryContactRules: {
    name: [
      { required: true, message: "请输入姓名", trigger: "blur" },
      { min: 1, max: 15, message: "最多可输入15字", trigger: "blur" },
    ],
    phone: [
      { required: true, message: "请输入联系方式", trigger: "blur" },
      { min: 1, max: 11, message: "最多可输入11字", trigger: "blur" },
    ],
  },
  // 销售清单表单校验规则
  querySaleRules: {
    saleCategory: [
      { required: true, message: "请选择销售类目", trigger: "change" },
    ],
    materialId: [
      { required: true, message: "请选择设备名称", trigger: "change" },
    ],
    quantity: [{ required: true, message: "请输入设备数量", trigger: "blur" }],
    brand: [{ required: true, message: "请输入设备品牌", trigger: "blur" }],
  },
  // 省列表
  provinceList: [],
  // 市列表
  cityList: [],
  // 区列表
  areaList: [],
  // 用户列表
  userList: [],
  auditRemark: "",
  auditResult: "",
  applyId: "",
});
const {
  projectForm,
  contactForm,
  saleForm,
  queryRules,
  queryContactRules,
  querySaleRules,
  provinceList,
  cityList,
  areaList,
  userList,
  auditRemark,
  auditResult,
  applyId,
} = toRefs(data);

let taskList = ref([]);
const activeName1 = ref("");
// 项目下任务列表
const projectTaskList = ref([]);

import print from "vue3-print-nb";

// 使用自定义指令
const vPrint = print;
const printFlag = ref(false);

let prints = {
  id: "print-iframe",
  popTitle: "配置页眉标题", // 打印配置页上方的标题
  extraHead: "", // 最上方的头部文字，附加在head标签上的额外标签，使用逗号分割
  preview: false, // 是否启动预览模式，默认是false
  previewTitle: "预览的标题", // 打印预览的标题
  previewPrintBtnLabel: "预览结束，开始打印", // 打印预览的标题下方的按钮文本，点击可进入打印
  zIndex: 20002, // 预览窗口的z-index，默认是20002，最好比默认值更高
  previewBeforeOpenCallback() {
    console.log("正在加载预览窗口！");
  }, // 预览窗口打开之前的callback
  previewOpenCallback() {
    console.log("已经加载完预览窗口，预览打开了！");
  }, // 预览窗口打开时的callback
  // 开始打印之前的callback
  beforeOpenCallback() {
    console.log("开始打印之前！");
  },
  openCallback() {
    console.log("执行打印了！");
  }, // 调用打印时的callback
  closeCallback() {
    console.log("关闭了打印工具！");
    printFlag.value = false;
  }, // 关闭打印的callback(无法区分确认or取消)
  clickMounted() {
    console.log("点击v-print绑定的按钮了！");
  },
  standard: "",
  extarCss: "",
};
// 进度详情的显隐
const handlerschedule = () => {
  showschedule.value = true;
};

const handlerPolling = () => {
  showPolling.value = true;
};

// 处理状态按钮点击
const handleStatusBtn = (val, text) => {
  console.log(val);
  statusVal.value = val;
  auditDialogShow.value = true;
  title.value = `项目状态将改为${text}，确认信息后将提交申请！`;
};

// 打印按钮点击
const handlePrint = () => {
  printFlag.value = true;
};

// 处理评论按钮点击
const handleEvaluate = () => {
  evaluateDialogShow.value = true;
};

// 保存评论
const saveEvaluate = async () => {
  if (!evaluateInfo.value) return ElMessage.info("请输入评论内容！");
  const data = {
    businessId: projectForm.value.projectId,
    content: evaluateInfo.value,
    modelType: 0,
  };
  const result = await addEvaluateApi(data);
  if (result.code === 200) {
    ElMessage.success(result.msg);
    evaluateDialogShow.value = false;
    evaluateInfo.value = "";
    getEvaluateList();
  }
};

/**
 * @description: 项目进度点击事件
 */
let activeindex = ref(0);
const handlerBusSchedule = async (item, index) => {
  presentBusinessScheduleName.value = item.label;
  activeindex.value = index;
  formdata.value.allotRelList = [];
  formdata.value.executor = "";
  formdata.value.startTime = "";
  formdata.value.endTime = "";
  formdata.value.projectTaskId = null;
  formdata.value.remark = "";
  formdata.value.estimatedWorkHours = "";
  formdata.value.deptId = null;
  formdata.value.actualStartTime = "";
      formdata.value.finishTime ="";
      formdata.value.performance = "";
      formdata.value.ywProjectTaskDetailInfoRespVos = []
  // currentTask.value = item.value;
  formdata.value.taskType = item.value;
  projectTaskList.value.forEach(async (taskItem) => {
    // 匹配当前任务
    if (taskItem.taskType === item.value) {
      formdata.value.allotRelList = taskItem.executorNums || [];
      formdata.value.executor = taskItem.executor || '';
      formdata.value.startTime = taskItem.startTime;
      formdata.value.endTime = taskItem.endTime;
      formdata.value.projectTaskId = taskItem.projectTaskId;
      formdata.value.remark = taskItem.remark;
      formdata.value.estimatedWorkHours = taskItem.estimatedWorkHours;
      formdata.value.deptId = taskItem.deptId;

      // if (props.pageType === "detail") {
      //   const res = await taskChangeDetailApi(taskItem.projectTaskId);
      //   changeRecordList.value = res;
      // }
    }
  });
  if (!!item.teskId) {
    findProjectMyTaskInfosById(item.teskId).then(res => {
      formdata.value.actualStartTime = res.taskInfoRespVo.actualStartTime;
      formdata.value.finishTime = res.taskInfoRespVo.finishTime;
      formdata.value.performance = res.taskInfoRespVo.performance;
      formdata.value.ywProjectTaskDetailInfoRespVos = res.taskInfoRespVo.suppFileInfoVos || [];
    })
  }
};

// 关闭评论弹窗
const closeEvaluate = () => {
  evaluateDialogShow.value = false;
  evaluateInfo.value = "";
};

// 获取评价列表
const getEvaluateList = async () => {
  const data = {
    businessId: projectForm.value.projectId,
    modelType: 0,
  };
  const result = await getEvaluateListApi(data);
  evaluateList.value = result.data || [];
};

// 处理进度保存
let showscheduleRef = ref(null);
const handlescheduleAdd = () => {
  showscheduleRef.value.handleraddbusSchedule();
};
const handlescheduleBack = () => {
  showschedule.value = false;
};

const saveCheck = async () => {
  let res = await projectFinishApi(projectForm.value.projectId);
  if (res.code === 200) {
    ElMessage.success(res.msg);
    closeAudit();
    handleDetailInfo(rowdata.value);
  } else {
    ElMessage.error(res.msg);
  }
};

const closeAudit = () => {
  auditRemark.value = "";
  auditResult.value = "";
  applyId.value = "";
  auditDialogShow.value = false;
};

/**
 * @description: 保存
 * @param {Object} customerFormRef 客户表单引用
 */
const handleAddSave = async (projectFormRef, type) => {
  // if (type && props.pageType === "edit") {
  //   return handleCheckBtn(projectFormRef, 1, "提交");
  // }
  if (!projectFormRef) return;
  if (
      type == 1 &&
      (projectForm.value.projectPracticeInfoRespVos.length == 0 ||
          projectForm.value.projectSaleInfoRespVos.length == 0)
  ) {
    ElMessage.error("请添加销售清单信息或甲方施工联系人信息");
    return;
  }
  await projectFormRef.validate(async (valid, fields) => {
    if (valid) {
      ElMessageBox.confirm("确定将以上数据存为草稿吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        confirmButtonClass: "confirmBtnClass",
        cancelButtonClass: "cancelBtnClass",
      })
          .then(async () => {
            projectForm.value.type = type;
            projectForm.value.startTime = projectForm.value.dateValue[0];
            projectForm.value.endTime = projectForm.value.dateValue[1];
            let res;

            if (!projectForm.value.projectId) {
              projectForm.value.checkStatus = type;
              res = await addProjectApi(projectForm.value);
            } else {
              res = await editProjectApi(projectForm.value);
            }
            if (res.code === 200) {
              emit("update:contractDtlShow", false);
              emit("refreshList", false);
              ElMessage.success(res.msg);
              projectForm.value = JSON.parse(JSON.stringify(projectFormTemplate));
            } else {
              ElMessage.error(res.msg);
            }
          })
          .catch(() => {
          });
    }
  });
};

/**
 * @description: 文件上传成功处理
 * @param {Object} response 文件信息
 */
function uploadSuccess(response) {
  // materialForm.value.materialPictures.push({ ...response, businessType: 4 });
}

/**
 * @description: 删除文件
 * @param {Number} index 当前文件索引
 */
function uploadRemove(index) {
  materialForm.value.materialPictures.splice(index, 1);
}

/**
 * @description: 处理销售类目选择
 * @param {Number} value 当前值
 */
const handleSaleCategory = (value) => {
  saleCategoryList.value.forEach((item) => {
    if (item.value === value) {
      saleForm.value.saleCategoryName = item.label;
    }
  });
  const obj = {
    brand: "",
    saleName: "",
    materialId: null,
    materialUnit: null,
    materialUnitName: "",
    platformName: "",
    technologyParameter: "",
    quantity: null,
    remarks: "",
  };
  saleForm.value = {...saleForm.value, ...obj};
};

/**
 * @description: 处理设备名称选择
 * @param {Number} value 当前值
 */
const handleDevice = (value) => {
  if (value) {
    deviceList.value.forEach((item) => {
      if (value === item.materialId) {
        saleForm.value.saleName = item.saleName;
        saleForm.value.materialUnit = item.materialUnit;
        saleForm.value.materialUnitName = item.materialUnitName;
        saleForm.value.technologyParameter = item.technologyParameter;
      }
    });
  } else {
    saleForm.value.saleName = "";
    saleForm.value.materialUnit = "";
    saleForm.value.materialUnitName = "";
    saleForm.value.technologyParameter = "";
  }
};

/**
 * @description: 处理续保记录变更
 */
const handleRenewalEdit = (row) => {
  console.log("处理续保记录变更");
  console.log(row);
};

/**
 * @description: 处理业务人员选择
 * @param {Number} value 当前值
 */
const handlePeopleChange = async (value) => {
  projectForm.value.customerId = null;
  if (value) {
    projectForm.value.customerId;
    await getCustomerListApi(projectForm.value.userId).then((res) => {
      if (res) {
        customerList.value = res;
      }
    });
  } else {
    customerList.value = [];
  }
};
/**
 * @description: 更进添加
 */
let isfollowAddRef = ref(null);
const followadd = () => {
  isfollowAddShow.value = true;
  nextTick(() => {
    isfollowAddRef.value.handleDetailInfo(rowdata.value);
  });

};

/**
 * @description: 更进添加
 */
let renewalAddRef = ref(null);
const renewalAdd = (row) => {
  renewalAddShow.value = true;
  nextTick(() => {
    renewalAddRef.value.handleDetailInfo(row);
  });
};

/**
 * @description: 更新编辑信息
 * @param {Number} id
 */
const handlerEditInfo = (data) => {
  isfollowAddShow.value = true;
  nextTick(() => {
    isfollowAddRef.value.editInfo(data);
  });
};

/**
 * @description: 返回
 */
const handleBack = () => {
  if (props.pageType === "detail" || props.pageType === "check") {
    emit("updateFollowAddShow", false);
    emit("update:contractDtlShow", false);
    projectForm.value = JSON.parse(JSON.stringify(projectFormTemplate));
  } else {
    ElMessageBox.confirm("确定返回上一级吗?以上数据未保存将会丢失!", "提示", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
      confirmButtonClass: "confirmBtnClass",
      cancelButtonClass: "cancelBtnClass",
    })
        .then(async () => {
          emit("update:contractDtlShow", false);
          projectForm.value = JSON.parse(JSON.stringify(projectFormTemplate));

        })
        .catch(() => {
        });
  }
  emit("refreshList", false);
};

/**
 * @description: 新增、编辑联系人
 * @param {Object} contactFormRef 联系人表单引用
 */
const handleContactAdd = async (contactFormRef) => {
  if (!contactFormRef) return;
  await contactFormRef.validate(async (valid, fields) => {
    if (valid) {
      if (operateType.value === "edit") {
        projectForm.value.projectPracticeInfoRespVos[tableIndex.value] =
            JSON.parse(JSON.stringify(contactForm.value));
      } else {
        projectForm.value.projectPracticeInfoRespVos.push(
            JSON.parse(JSON.stringify({...contactForm.value}))
        );
      }
      contactForm.value = {
        name: "",
        phone: "",
        practiceId: null,
        projectId: null,
        remarks: "",
      };
      //   contactAddShow.value = false;
      contactFormRef.resetFields();
      nextTick(() => {
        contactRefInput.value.focus(); // 聚焦
      });
    } else {
      console.log("error submit!");
    }
  });
  //   operateType.value = "";
};

/**
 * @description: 新增、编辑销售清单
 * @param {Object} saleFormRef 联售清单引用
 */
const handleSaleAdd = async (saleFormRef) => {
  if (!saleFormRef) return;
  await saleFormRef.validate(async (valid, fields) => {
    if (valid) {
      if (operateType.value === "edit") {
        projectForm.value.projectSaleInfoRespVos[tableIndexSec.value] =
          JSON.parse(JSON.stringify(saleForm.value));
      } else {
        projectForm.value.projectSaleInfoRespVos.push(
          JSON.parse(JSON.stringify({ ...saleForm.value }))
        );
      }
      saleForm.value = {
        brand: "",
        saleName: "",
        materialId: null,
        materialUnit: null,
        materialUnitName: "",
        platformName: "",
        technologyParameter: "",
        projectId: null,
        projectSaleId: null,
        quantity: null,
        remarks: "",
        saleCategory: null,
        saleCategoryName: "",
        saleName: "",
      };
      //   contactAddShow.value = false;
      saleFormRef.resetFields();
      nextTick(() => {
        refSelect.value.focus(); // 聚焦
      });
    } else {
      console.log("error submit!");
    }
  });
  //   operateType.value = "";
};

/**
 * @description: 处理联系人操作
 */
const handleContactOperate = () => {
  contactAddShow.value = true;
  operateType.value = "add";
  nextTick(() => {
    contactRefInput.value.focus(); // 聚焦
  });
};

/**
 * @description: 处理销售清单操作
 */
const handleSaleOperate = () => {
  saleAddShow.value = true;
  operateType.value = "add";
  nextTick(() => {
    refSelect.value.focus(); // 聚焦
  });
};

/**
 * @description: 联系人返回
 */
const handleProjectBack = () => {
  contactAddShow.value = false;
  nextTick(() => {
    refInput.value.focus(); // 聚焦
  });
};

/**
 * @description: 销售清单返回
 */
const handleSaleBack = () => {
  saleAddShow.value = false;
  nextTick(() => {
    refInput.value.focus(); // 聚焦
  });
};

/**
 * @description: 处理省市区操作
 * @param {String} type 类型
 */
const handleProvince = (type) => {
  switch (type) {
    case "province":
      cityList.value = [];
      areaList.value = [];
      projectForm.value.city = null;
      projectForm.value.area = null;
      getProvinceApi(projectForm.value.province).then((res) => {
        if (res.code === 200) {
          cityList.value = res.data;
        }
      });
      break;
    case "city":
      areaList.value = [];
      projectForm.value.area = null;
      getProvinceApi(projectForm.value.city).then((res) => {
        if (res.code === 200) {
          areaList.value = res.data;
        }
      });
      break;
  }
};

/**
 * @description: 处理工单跳转
 */
const handleWorkDetail = (row) => {
  console.log(row);
  workOrderDetailShow.value = true;
  nextTick(() => {
    projectCheckRef.value.handleDetailInfo(row.id);
  });
};

/**
 * @description: 处理销售清单表格操作
 * @param {String} type 操作类型
 * @param {Object} row  当前行数据
 * @param {Number} tabIndex 表格当前索引
 */
const handleOperateSec = (type, row, tabIndex) => {
  if (type === "edit") {
    tableIndexSec.value = tabIndex;
    saleForm.value = JSON.parse(JSON.stringify(row));
    saleAddShow.value = true;
    operateType.value = "edit";
    nextTick(() => {
      refSelect.value.focus(); // 聚焦
    });
  } else {
    projectForm.value.projectSaleInfoRespVos.splice(tabIndex, 1);
  }
};

/**
 * @description: 处理联系人表格操作
 * @param {String} type 操作类型
 * @param {Object} row  当前行数据
 * @param {Number} tabIndex 表格当前索引
 */
const handleOperate = (type, row, tabIndex) => {
  if (type === "edit") {
    tableIndex.value = tabIndex;
    contactForm.value = JSON.parse(JSON.stringify(row));
    contactAddShow.value = true;
    operateType.value = "edit";
    nextTick(() => {
      contactRefInput.value.focus(); // 聚焦
    });
  } else {
    projectForm.value.projectPracticeInfoRespVos.splice(tabIndex, 1);
  }
};

/**
 * @description: 处理文件点击
 * @param {Object} item 文件信息
 */
 const handleFileClick = (item) => {
  let docUrl = item.url;
  let officeUrl =
    "http://101.71.158.60:50098/onlinePreview?url=" +
    encodeURIComponent(Base64.encode(docUrl)) +
    "&watermarkTxt=" +
    encodeURIComponent(userStore.nickName); // 在新窗口打开编码后的链接
  window.open(officeUrl, "_target");
};

/**
 * @description: 处理详情信息
 * @param {Number} id
 */
let rowdata = ref(null);
const handleDetailInfo = async (row, activce) => {
  rowdata.value = row;
  console.log("rowdata.value", rowdata.value)
  activeName1.value = activce;
  presentBusinessScheduleName.value = '项目启动会'
  try {
    // followAddShow.value = true;
    // nextTick(() => {
    //   followAddRef.value.handleDetailInfo(row);
    // });
    detailInfoShow.value = true;
    const res = await projectTaskDetailApi(row.projectId);
    projectForm.value = {
      ...res.projectInfoRespVo,
      projectEndTime1: res.projectInfoRespVo.projectEndTime,
      // projectPracticeInfoRespVos: res.projectPracticeInfoRespVos,
      // projectSaleInfoRespVos: res.projectSaleInfoRespVos,
    };
    projectForm.value.manHour = res.manHour
    projectForm.value.taskNumber = res.number
    projectForm.value.dateValue = [
      projectForm.value.startTime,
      projectForm.value.endTime,
    ];
    pointData.value = res.pointAddInfoRespVos || [];
    deviceData.value = res.installDeviceInfoRespVos || [];

    pointData.value.forEach((followItem) => {
          followItem.suppFileInfoVos1 = [];
          followItem.suppFileInfoVos2 = [];
          followItem.suppFileInfoVos3 = [];
          followItem.suppFileInfoVos4 = [];
          followItem.suppFileInfoVos5 = [];
          followItem.suppFileInfoVos6 = [];
          followItem.suppFileInfoVos7 = [];
        });
        deviceData.value.forEach((followItem) => {
          followItem.suppFileInfoVos1 = [];
          followItem.suppFileInfoVos2 = [];
          followItem.suppFileInfoVos3 = [];
          followItem.suppFileInfoVos4 = [];
          followItem.suppFileInfoVos5 = [];
          followItem.suppFileInfoVos6 = [];
          followItem.suppFileInfoVos7 = [];
        });
        console.log('pp')
        console.log(pointData.value)
        console.log(deviceData.value)
    
       pointData.value.forEach((followItem) => {
        if(followItem.suppFileInfoVos) {
          followItem.suppFileInfoVos.forEach((groupItem) => {
            followItem[`suppFileInfoVos${groupItem.erpTaskType}`] = [groupItem];
          });
        }
       });
     
 
       deviceData.value.forEach((followItem) => {
        if(followItem.suppFileInfoVos) {
         followItem.suppFileInfoVos.forEach((groupItem) => {
           followItem[`suppFileInfoVos${groupItem.erpTaskType}`] = [groupItem];
         });
        }
       });
     
        console.log(222)
    
    getSaleList();
    getConstructionList();
    getRenewalList();
    getWorkList();

    // 任务
    projectTaskList.value = res.projectAllotTaskInfoRespVos;
    taskList.value.forEach((item) => {
      projectTaskList.value.forEach((proItem) => {
        if (item.value === proItem.taskType) {
          item.type = "已分配";
          item.teskId = proItem.projectTaskId;
        }
      });
    });
    handlerBusSchedule(taskList.value[0], 0);

    await getProvinceApi(projectForm.value.province).then((res) => {
      if (res.code === 200) {
        cityList.value = res.data;
      }
    });
    await getProvinceApi(projectForm.value.city).then((res) => {
      if (res.code === 200) {
        areaList.value = res.data;
      }
    });
    await getCustomerListApi(projectForm.value.userId).then((res) => {
      if (res) {
        customerList.value = res;
      }
    });
    // const resAudit = await selectAuditList(row.projectId);
    // auditList.value = resAudit.data;
    // if (resAudit.data.length) {
    //   flowInfoList.value = resAudit.data[0].chartVo.flowList;
    //   flowingStep.value = resAudit.data[0].chartVo.flowingStep;
    // }
    
    setTimeout(() => {
      detailInfoShow.value = false;
      getEvaluateList();
    }, 500);
  } catch (error) {
    console.log('cw')
    detailInfoShow.value = false;
  }
};

/**
 * @description: 获取销售清单列表
 */
const getSaleList = async () => {
  let {pageNum, pageSize} = params;
  const res = await selectSaleByProjectIdAdd(
      {pageNum, pageSize},
      {projectId: projectForm.value.projectId}
  );
  console.log("销售清单", res);
  salesListData.value = res.rows;
  total.value = res.total;
};
/**
 * @description: 获取施工联系人列表
 */
const getConstructionList = async () => {
  let {pageNum, pageSize} = construction;
  const res = await selectPracticeInfosByProjectIdAdd(
      {pageNum, pageSize},
      {projectId: projectForm.value.projectId}
  );
  console.log("施工清单", res);
  constructionData.value = res.rows;
  constructioTotal.value = res.total;
};

/**
 * @description: 获取续保列表
 */
const getRenewalList = async () => {
  let {pageNum, pageSize} = renewalParams;
  const res = await getRenewalListApi({
    projectId: projectForm.value.projectId,
    pageNum,
    pageSize,
  });
  console.log("续保列表", res);
  renewalData.value = res.rows;
  renewalTotal.value = res.total;
};
/**
 * @description: 获取工单列表
 */
const getWorkList = async () => {
  let {pageNum, pageSize} = workParams;
  const res = await getWorkListApi(
      {pageNum, pageSize},
      {
        projectId: projectForm.value.projectId,
      }
  );
  console.log("工单列表", res);
  workData.value = res.rows;
  workTotal.value = res.total;
};

/**
 * @description: 获取字典
 */
async function getDicts() {
  await getDictsApi("erp_task_type").then((res) => {
    // 任务列表
    if (res.code === 200) {
      taskList.value = res.data;
      taskList.value.forEach((item) => {
        item.type = "未分配";
      });
    }
  });
  // 设备列表
  await getallMaterialListApi({}, {}).then((res) => {
    deviceList.value = res;
  });
  // 销售项目类目
  await getDictsApi("erp_sale_category").then((res) => {
    if (res.code === 200) {
      saleCategoryList.value = res.data;
    }
  });

  // 是否签合同
  await getDictsApi("erp_include_contract").then((res) => {
    if (res.code === 200) {
      contractList.value = res.data;
    }
  });
  // 是否中标
  await getDictsApi("erp_successful_bidder").then((res) => {
    if (res.code === 200) {
      successfulList.value = res.data;
    }
  });

  // 项目种类
  await getDictsApi("erp_project_category").then((res) => {
    if (res.code === 200) {
      kindList.value = res.data;
    }
  });
  // 所属行业
  await getDictsApi("erp_project_industry").then((res) => {
    if (res.code === 200) {
      industryList.value = res.data;
    }
  });
  // 项目状态
  await getDictsApi("erp_project_status").then((res) => {
    if (res.code === 200) {
      statusList.value = res.data;
    }
  });
  // 项目类型
  await getDictsApi("erp_project_type").then((res) => {
    if (res.code === 200) {
      typeList.value = res.data;
    }
  });
  // 用户
  await getUserListApi().then((res) => {
    if (res.length > 0) {
      userList.value = res;
    }
  });
  // 省
  await getProvinceApi(1).then((res) => {
    if (res.code === 200) {
      provinceList.value = res.data;
    }
  });
}
/**
 * @description: 修改tab
 */
const changetab = (value) => {
  if (value == "approval") {
    // getBusScheduleList();
  }
};
/**
 * @description: 查询项目商务进度列表
 */
const getBusScheduleList = () => {
  return
  getBusScheduleListByProjectId(rowdata.value.projectId).then((res) => {
    if (res.data.projectBusinessScheduleRespVos.length != 0) {
      BusScheduleList = BusScheduleList.map((item, index) => {
        let obj = {};
        res.data.projectBusinessScheduleRespVos.find((jtem, index) => {
          if (jtem.businessSchedule == item.businessSchedule) {
            obj = {
              ...item,
              ...jtem,
            };
          } else {
            obj = {
              ...item,
            };
          }
          return jtem.businessSchedule == item.businessSchedule;
        });
        return obj;
      });
      console.log("BusScheduleList", BusScheduleList);
      formdata.value = BusScheduleList[0];
      presentBusinessScheduleName.value = res.data.presentBusinessScheduleName;
    } else {
    }
  });
};

onMounted(() => {
  getDicts();
  // nextTick(() => {
  //   refInput.value.focus(); // 聚焦
  // });
});

defineExpose({
  handleDetailInfo,
});
</script>
<style lang="scss" scoped>
:deep(.el-collapse-item__header) {
  background-color: #f8faff;
}

.dialog-title-accep {
  width: 100%;
  height: 40px;
  display: flex;
  align-items: center;
  padding-left: 20px;
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: 600;
}

.dialog-title2 {
  padding-left: 20px;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 500;
}

.projectAdd {
  padding: 20px 20px 0 20px;
  width: 100%;
  height: 100%;

  :deep(.el-date-editor.el-input, .el-date-editor.el-input__wrapper) {
    width: 268px !important;
    height: 34px !important;
  }

  :deep(.pagination-container) {
    height: 56px;
  }

  .content {
    width: 1604px;
    /* height: 130px; */
    background: #ffffff;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
    padding: 20px;
    // margin-top:10px;
    margin-bottom: 20px;

    .content-top {
      display: flex;
      align-items: center;

      .content-title {
        font-family: PingFang SC;
        font-weight: 500;
        font-size: 18px;
        color: #333333;
        line-height: 42px;
      }

      .content-tab {
        display: flex;
        align-items: center;

        .item-tab {
          padding: 3px 5px;
          margin: 0 10px;
        }

        .tooltip {
          display: flex;
          align-items: center;

          .triangle {
            width: 0;
            height: 0;
            border-left: 10px solid transparent;
            border-right: 10px solid transparent;
            border-bottom: 17.3px solid #fdefdc; /* 边长为100px时，高度为边长的正弦值乘以2/3 */
            transform: rotate(-90deg);
          }

          .contenttext {
            max-width: 800px;
            padding: 10px;
            background-color: #fdefdc;
            transform: translateX(-5px);
            color: #d95700;
          }
        }
        .item-tab:nth-child(1) {
          color: rgba(87, 107, 249, 1);
          background-color: rgba(87, 107, 249, 0.2);
        }

        .item-tab:nth-child(2) {
          color: rgba(230, 122, 37, 1);
          background-color: rgba(230, 122, 37, 0.2);
        }

        .item-tab:nth-child(3) {
          color: rgba(63, 161, 122, 1);
          background-color: rgba(63, 161, 122, 0.2);
        }
      }
    }

    .content-bottom {
      display: flex;
      margin: 20px 0;
      font-family: PingFang SC;
      font-weight: 400;
      font-size: 14px;
      color: #333333;

      .item {
        width: 20%;
        display: flex;
        align-items: center;
      }
    }
  }

  .project-info {
    padding: 20px 20px 5px 20px;
    background-color: #f0f0f0;
    margin: 10px 0;
  }

  .contact-info {
    padding-top: 20px;
  }

  .project-title {
    display: flex;
    padding-top: 30px;
  }

  .schedule-form {
    margin: 30px 0;

    .form {
      display: flex;
      margin-top: 15px;
      background-color: #fafbff;

      .form-left {
        width: 20%;
        height: 100%;

        .item {
          background-color: #d9dce4;
          height: 50px;
          line-height: 50px;
          text-align: center;
          border: 1px solid #f2f2f2;
          cursor: pointer;
          display: flex;
          justify-content: center;
        }

        .item:first-child {
          background-color: unset;
          font-size: 18px;
          font-weight: 700;
        }

        .activeitem {
          background-color: #007cef;
        }
      }

      .form-right {
        width: 85%;
        padding-left: 20px;
        border: 1px solid #f2f2f2;
        padding-right: 20px;

        .right-title {
          height: 50px;
          line-height: 50px;
          font-size: 18px;
          font-weight: 700;
        }

        .subtitle {
          display: flex;
          align-items: center;
          margin: 12px 0;

          .dot {
            width: 13px;
            height: 13px;
            background-color: #0179ed;
            border-radius: 50%;
            margin-right: 10px;
          }
        }

        .right-form {
          /* height: calc(100% - 50px); */
          display: flex;
          flex-direction: column;
          justify-content: space-between;
        }
      }
    }
  }

  :deep(.el-table) {
    th.el-table__cell {
      background: #f8f8f8 !important;
    }
  }

  .ription {
    color: #ff0000;
    line-height: 16px;
    font-size: 12px;
  }

  :deep(.el-step__head.is-success) {
    color: #3399ff;
    border-color: #3399ff;
    position: relative;
  }

  :deep(.el-step__title) {
    font-size: 16px;
    line-height: 38px;
    position: absolute;
    top: -38px;
    width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  :deep(.el-step__title.is-success) {
    color: #3399ff;
  }

  :deep(.desLabel) {
    background: transparent !important;
    width: 200px;
    font-weight: 500 !important;
  }

  .desContent {
    // width: 100%;
    width: 330px;
    overflow: hidden;
    white-space: nowrap; /* 确保文本在一行内显示 */
    text-overflow: ellipsis; /* 使用省略号表示文字被截断 */
  }

  :deep(.desInfo) {
    width: 200px;
  }

  .submitBtn {
    padding-top: 6px;
    padding-left: 5px;
    color: #4359f9;
    cursor: pointer;
  }

  .desBox {
    height: 50px;
    display: flex;
    align-items: center;
  }

  .contact-table-info {
    // width: 780px;
    min-height: 50px;
    // padding-left: 20px;
    // margin-left: 20px;
    display: flex;
    overflow: auto;
  }

  .box-item {
    margin-right: 20px;
    position: relative;
    border: 1px solid #d7d7d7;
    width: 650px;
    min-height: 350px;
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 20px;
  }

  .item-btn {
    position: absolute;
    right: 10px;
  }

  .item {
    display: flex;
  }

  .mb10 {
    margin-bottom: 15px;
  }

  .box-content {
    display: block;
    width: 200px;
    text-align: left;
    overflow: hidden;
  }

  .box-title {
    text-align: right;
    width: 108px;
    display: block;
  }
}

.dialog-title {
  background-color: #fdefdc;
  width: 100%;
  height: 40px;
  display: flex;
  align-items: center;
  padding-left: 20px;
  margin-bottom: 20px;
}

.el-table {
  border: var(--el-table-border);
}

.approval-box {
  padding: 20px;
}
</style>

<style>
.dialogBox .el-dialog__body {
  padding: 10px 20px !important;
}
</style>
